import React, { Component } from 'react';
import { Form, Icon, Input, Button, message } from 'antd';
import '../css/index.css';


const FormItem = Form.Item;
let _this = this;
class Login extends React.Component {



  handleLogin() {

    message.error('用户名或者密码错误请重新登录', 10);
    window.location.href = "#/main";

    $.post("/test.do", { "name": $("#userName").val(), "pwd": $("#password").val() }, function (type) {
      if (type === "1") {
        message.success('登录成功', 10);
        _this.context.router.push('/main');
      }
      else {
        message.warning('登录失败', 10);
      }
    });

  }

  render() {
    const { getFieldDecorator, getFieldsError, getFieldError, isFieldTouched } = this.props.form;
    return <div>

      <video className="img-bg-img" src="../img/time.mp4" autoPlay="autoPlay" loop="loop" muted="muted" >
        您的浏览器不支持 video 标签。
</video>
      <div className="indexdiv">
        <Form   >


          <FormItem

          >
            {getFieldDecorator('userName', {
              rules: [{ required: true, message: '请输入用户名...' }],
            })(
              <Input id="userName" prefix={<Icon type="user" style={{ fontSize: 18 }} />} placeholder="请输入用户名..." />
              )}
          </FormItem>
          <FormItem

          >
            {getFieldDecorator('password', {
              rules: [{ required: true, message: '请输入密码...' }],
            })(
              <Input id="password" prefix={<Icon type="lock" style={{ fontSize: 18 }} />} type="password" placeholder="请输入密码..." />
              )}
          </FormItem>
          <FormItem>
            <Button
              type="primary"
              htmlType="submit"
              loading={false}
              onClick={this.handleLogin.bind(this)}
            >
              Log in
          </Button>

          </FormItem>
        </Form>
      </div></div>;



  }

}


export default Form.create()(Login);